import React,{Component} from 'react'
import PubSub from 'pubsub-js';
import Son from './son'
import {Link} from 'react-router-dom'
import logo from '../logo.svg';
import '../static/css/App.css';
export default class Index extends Component{
	constructor(){
    super();
    this.state  = {
      msg:"这是react的信息",
      nowTime:"",
      status:false,
       intervalTime:null,
      myName:"张三",
      musicList:[
        {
          name:"lala1",
          time:"10min"
        },
        {
          name:"xdvsd",
          time:"10min"
        },
        {
          name:"sfdsfdsdf",
          time:"10min"
        },
        {
          name:"yuikyu",
          time:"10min"
        },
        {
          name:"体育体育他",
          time:"10min"
        },
        {
          name:"就漏尿中心",
          time:"10min"
        },
        {
          name:"嗲二桥中",
          time:"10min"
        }
      ]
    }
  }
	 propsTypes:{
	 	title:React.propsTypes.String
	 }
	handleClickOnTitle(ds){
		this.setState({
			status:!this.state.status,
			myName:"李四",
		});


   console.log(this.refs.clickBtn);
		PubSub.publish('PubSubmessage', this.state.myName);
	}

  componentWillMount(){
    var self = this;
    //创建定时器，同时给state的nowTime赋值
   this.intervalTime = setInterval(function(){
      let theTime = new Date();
      self.setState({
        nowTime:theTime.getFullYear()+"年"+(theTime.getMonth()+1)+"月"+theTime.getDate()+"日"+theTime.getHours()+":"+theTime.getMinutes()+":"+theTime.getSeconds()
      })
    },1000);

  }
  showName(name){
      console.log(name);
  }
  componentWillUnmount(){
      clearInterval(this.intervalTime)
  }
  render(){

  		return (
      			<div className="App">
    		 		<header className="App-header">
    		          <img src={logo} className="App-logo" alt="logo" />
    		          <h1 className="App-title">Welcome to React</h1>
    		        </header>

    		        <div>{this.props.title}</div>
    		        {this.state.nowTime}
    		        <div>{this.state.status?"取消":"点赞"}</div>
    		        <Son myName={this.state.myName} showMyName={this.showName.bind(this)}/>
    		        <button ref="clickBtn" onClick={this.handleClickOnTitle.bind(this,"dm")}>点击</button>
                <ul>
                   {
                    this.state.musicList.map((music,index)=>
                          <li key={index}>{music.name}</li>
                    )
                   }
                </ul>
                    <Link to="/about">about</Link>
                  </div>

  	)
  }
}
